import React, { Component, Fragment } from 'react';
import { connect } from 'dva';
import StandardTable from '@/components/StandardTable';
import { allDispatchType, selectInfoList, codes } from './utils';

@connect(({ declare, loading }) => ({
  containerList: declare.containerList,
  loading: loading.effects[allDispatchType.containerList],
}))
export default class DeclareInfo extends Component {
  state = {
    formValues: {},
    id: '',
  };

  componentDidMount() {
    const { dispatch, detailId } = this.props;
    this.setState({
      id: detailId,
    });
    this.selectContainerList(detailId);
  }

  selectContainerList = id => {
    selectInfoList({
      type: allDispatchType.containerList,
      payload: { deliveryId: id },
      props: this.props,
    });
  };

  handleStateChange = (options = []) => {
    options.map(item => {
      this.setState(item);
    });
  };

  columns = [
    {
      title: '集装箱(器)编号',
      dataIndex: 'containerNo',
    },
    {
      title: '尺寸和类型',
      dataIndex: 'sizeType',
    },
    {
      title: '来源代码',
      dataIndex: 'sourceCode',
    },
    {
      title: '重箱或空箱标识',
      dataIndex: 'boxSign',
    },
  ];

  /**
   * table 表格 分页操作
   */
  handleStandardTableChange = param => {
    const { detailId } = this.state;
    selectInfoList({
      type: allDispatchType.containerList,
      payload: { deliveryId: detailId, ...param },
      props: this.props,
    });
  };

  render() {
    const { containerList, loading } = this.props;
    const { id } = this.state;

    return (
      <Fragment>
        <StandardTable
          disabledRowSelected={true}
          loading={loading}
          data={containerList[id] || {}}
          columns={this.columns}
          scrollX={2000}
          scrollY={200}
          //   code="BillInfo"
          onPaginationChange={this.handleStandardTableChange}
        />
      </Fragment>
    );
  }
}
